<script setup lang="ts">
import { ref, watch, computed } from 'vue'
import { roleStore } from '@/stores/role'
import { headersStore } from '@/stores/apiHeader'
// 利润额趋势
import ProfitTrendGlobal from '@/components/PermissionsModule/Finance/components/ProfitTrendGlobal.vue'
// 利润率趋势
import ProfitTrendRate from '@/components/PermissionsModule/Finance/components/ProfitTrendRate.vue'
// 边际贡献额与边际贡献率
import FinancialRevenueRight from '@/components/Echart/flexGlobal/FinancialRevenueRight.vue'
// 边际贡献额同环比
import MarginalAmountGrow from '@/components/PermissionsModule/Finance/components/MarginalAmountGrow.vue'
//利润额同比增长趋势（月份）
import GlobalYoYTrendYoY from '@/components/PermissionsModule/Finance/components/GlobalYoYTrendYoY.vue'
// 利润额环比增长趋势（月份）
import GlobalMoMTrendMoM from '@/components/PermissionsModule/Finance/components/GlobalMoMTrendMoM.vue'
// 利润额各区同比增涨额对比
import FinancialReport from '@/components/PermissionsModule/Finance/components/FinancialReport.vue'
// 利润额各区同比增涨额对比
import ComparisonOfYoY from '@/components/PermissionsModule/Finance/components/ComparisonOfYoY.vue'
// 利润额及增长率环比增长对比
import ProfitMarginsRegionMoMIncrease from '@/components/PermissionsModule/Finance/components/ProfitMarginsRegionMoMIncrease.vue'
// 利润额同比增涨额对比
import ComparisonOfYearOnYearIncreaseInProfitsByRegion from '@/components/PermissionsModule/Finance/components/ComparisonOfYearOnYearIncreaseInProfitsByRegion.vue'
// 利润额环比增涨额对比
import ComparisonOfQuarterlyIncreaseInProfitsByRegion from '@/components/PermissionsModule/Finance/components/ComparisonOfQuarterlyIncreaseInProfitsByRegion.vue'
// 亏损前5名国家
import LossTopTenCountries from '@/components/PermissionsModule/Finance/components/LossTopTenCountries.vue'
// 利润额与利润率
import GetIncomeVolumeRate from '@/components/PermissionsModule/Finance/components/GetIncomeVolumeRate.vue'
//
import ProfitsAndProfitMarginsRegionMoMIncreaseComparison from '@/components/PermissionsModule/Finance/components/ProfitsAndProfitMarginsRegionMoMIncreaseComparison.vue'
//利润额同比增长趋势
import GlobalProfitYearOnYearIncreaseTrend from '@/components/PermissionsModule/Finance/components/GlobalProfitYearOnYearIncreaseTrend.vue'
// 利润额环比增长趋势
import GlobalProfitMomIncreaseTrend from '@/components/PermissionsModule/Finance/components/GlobalProfitMomIncreaseTrend.vue'
//利润额及增长率同比增长对比
import ComparisonOfIncreaseInProfitsAndProfitMarginsByRegion from '@/components/PermissionsModule/Finance/components/ComparisonOfIncreaseInProfitsAndProfitMarginsByRegion.vue'

const store = roleStore() as any
const { financeLevel } = store

const rule = ref() // 1 普通 2 中级 3 高级
const info = () => {
  rule.value = financeLevel
}
info()
// 1 全球 2 区域 3 国家
const newRole = ref(0)
newRole.value = financeLevel // 初始化面板权限
//获取当前月份
const month = computed(() => {
  return headersStore().month
})
// 区分全球区域对比或国家对比  0各个区域，1 各个国家 默认空
const every_code = computed(() => {
  return headersStore().every_code
})
// 深度监听 store.panelPermissions
watch(
  () => store.financeLevel,
  (newVal) => {
    newRole.value = newVal
  }
)
const props = defineProps({
  showRemainingComponents: {
    type: Boolean,
    default: false,
  },
})
</script>

<template>
  <ProfitTrendGlobal v-if="newRole != 0 && month == '00'" />
  <ProfitTrendRate v-if="newRole != 0 && month == '00'" />
  <FinancialRevenueRight
    v-if="newRole != 0 && month !== '00' && every_code == ''"
  />
  <MarginalAmountGrow
    v-if="newRole != 0 && month !== '00' && every_code == ''"
  />

  <GetIncomeVolumeRate
    v-if="newRole != 0 && month !== '00' && every_code != ''"
  />
  <ProfitsAndProfitMarginsRegionMoMIncreaseComparison
    v-if="newRole != 0 && month !== '00' && every_code != ''"
  />

  <GlobalYoYTrendYoY
    v-if="newRole != 0 && month !== '00' && every_code == ''"
  />
  <div v-if="showRemainingComponents">
    <GlobalProfitYearOnYearIncreaseTrend
      v-if="newRole != 0 && month == '00' && every_code == ''"
    />
    <GlobalProfitMomIncreaseTrend
      v-if="newRole != 0 && month == '00' && every_code == ''"
    />
    <FinancialReport v-if="newRole <= 2 && every_code != ''" />
    <ProfitMarginsRegionMoMIncrease
      v-if="newRole != 0 && month == '00' && every_code != ''"
    />
    <ComparisonOfYearOnYearIncreaseInProfitsByRegion
      v-if="newRole != 0 && month == '00' && every_code != ''"
    />
    <ComparisonOfQuarterlyIncreaseInProfitsByRegion
      v-if="newRole != 0 && month == '00' && every_code != ''"
    />
    <LossTopTenCountries v-if="newRole <= 2 && every_code != ''" />

    <GlobalMoMTrendMoM
      v-if="newRole != 0 && month !== '00' && every_code == ''"
    />
    <ComparisonOfIncreaseInProfitsAndProfitMarginsByRegion
      v-if="newRole != 0 && month !== '00' && every_code != ''"
    />
    <ComparisonOfYoY v-if="newRole != 0 && month == '00' && every_code != ''" />
  </div>
</template>
<style lang="scss" scoped></style>
